<template>
    <a-modal :title="$t('创建本地用户')" v-model='isShow' @cancel='handleClose' width='480px' @ok='handleCreate'
        :cancelText="$t('Cancel')" :okText="$t('Sure')" :maskClosable='false' v-dragModal>
        <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
            <a-spin :spinning="loading">
                <a-form-model-item :label="$t('用户名称')" prop="user">
                    <a-input v-model="form.user" :placeholder="$t('Enter') + $t('用户名称')" />
                </a-form-model-item>
                <a-form-model-item :label="$t('Password')" prop="pwd">
                    <a-input-password v-model="form.pwd" :placeholder="$t('Enter') + $t('Password')" />
                </a-form-model-item>
                <a-form-model-item :label="$t('Confirm-password')" prop="confirm_password">
                    <a-input-password v-model="form.confirm_password" :placeholder="$t('Enter') + $t('Confirm-password')" />
                </a-form-model-item>
            </a-spin>
        </a-form-model>
    </a-modal>
</template>

<script>
export default {
    data() {
        return {
            isShow: false,
            loading: false,
            labelCol: { span: 6 },
            wrapperCol: { span: 18 },
            form: {
                user: '',
                pwd: '',
                confirm_password: '',
            },
            rules: {
                user: [
                    { required: true, message: this.$t('Enter') + this.$t('用户名称'), trigger: 'blur' },
                    { pattern: /^[A-Za-z][A-Za-z0-9_-]{2,31}$/, message: this.$t('允许大小写字母、数字、下划线、中划线、长度3-32位、必须以字母开头'), trigger: 'blur' }
                ],
                pwd: [
                    { required: true, message: this.$t('Enter') + this.$t('Password'), trigger: 'blur' },
                    { pattern: /^[A-Za-z0-9_]{6,20}$/, message: this.$t('只允许输入字母、数字或下划线，长度控制在6-20个字符'), trigger: 'blur' }
                ],
                confirm_password: [
                    { required: true, message: this.$t('Enter') + this.$t('Confirm-password'), trigger: 'blur' },
                    { validator: (rules,value,callback)=>{this.confirmValidator(rules,value,callback)}, trigger: 'blur' },
                ],
            },
        };
    },
    methods: {
        handleCreate() {
            this.$refs.ruleForm.validate(async valid => {
                if (valid) {
                    this.loading = true
                    const { user, pwd } = this.form
                    const { data } = await this.$api.samba.appendSambaApi({ user, pwd })
                    this.model(data.id) //返回模板
                    this.notice(data.id, data.params, data.flag) //通知列表显示
                    if (data.flag == '0') {
                        this.$emit('get-list')
                        this.handleClose()
                    }
                    this.loading = false
                } else {
                    return false;
                }
            });
        },
        handleClose() {
            this.$refs['ruleForm'].resetFields();
            this.isShow = false
        },
        confirmValidator(rule, value, callback) {
            if (value) {
                if (value !== this.form.pwd) callback('两次密码请输入一致')
                else callback()
            }
        },
    }
}
</script>